<template>
  <!-- 实测实量点位清单维护 -->
  <base-breadcrumb :title="$route.meta.title">
        <a-row :gutter="10" class="page-height">
          <a-col :span="4">
            <a-card
            style="border-right:1px solid #d9d9d9" 
              class="page-height-tree"
            >
            <!-- 分部分项 -->
            <tree-sub-item
              ref="treeSearch"
              :id="projectTypeId"
              isDisabled
              :query="{ isChildren: false }"
              @loader="search"
              :selectedKeys.sync="selectedKeys"
              :selectOptions.sync="selectOptions"
            ></tree-sub-item>
          </a-card>
          </a-col>
          <a-col :span="20" class="page-height-list-wrapper" style="background:#fff">
            <!-- 工程类别 -->
            <tabs-product-type :id.sync="projectTypeId" @switch="getSubItem"></tabs-product-type>
            <searchData  :searchData="searchArr" @search="search"></searchData>
            <div class="page-height-list">
            <a-row type="flex" justify="space-between" align="top">
              <!-- 组织等级tabs -->
              <a-col>
                <TabsOrgLevels :id.sync="checkItemLevelId" :option.sync="checkItemOption" @switch="handleSwitch" />
              </a-col>
              <!-- 操作栏 -->
              <a-col>
                <a-button
                  v-btnPermission="[
                        {
                          ident: 'prma_seex',
                          code: 'seex_qm_032_add_01'
                        },
                        {
                          ident: 'prma_buco',
                          code: 'buco_qm_032_add_01'
                        }
                ]"
                  icon="plus"
                  type="primary"
                  :disabled="hasChildren"
                  @click="handleManage(0)"
                  >添加点位</a-button
                >
              </a-col>
            </a-row>
            <!-- 表格 -->
            <list-table
              ref="table"
              size="default"
              :rowKey="(record) => record.id"
              :columns="columns"
              :request="loadData"
              :alert="true"
              show-size-changer
              show-quick-jumper
              :isDrag="false"
              :isFixedRight="false"
              :isScrollX="false"
              showPagination="auto"
            >
              <!-- 表格行操作栏 -->
              <span slot="action" slot-scope="text, record">
                <MoreButton>
                  <a v-btnPermission="[
                        {
                          ident: 'prma_seex',
                          code: 'seex_qm_032_loo_03'
                        },
                        {
                          ident: 'prma_buco',
                          code: 'buco_qm_032_loo_03'
                        }
                ]" @click="handleManage(2, record)">查看</a>
                  <template v-if="editModel != '0'">
                    <template v-if="record.whetherEdit == '1'">
                      <a v-btnPermission="[
                        {
                          ident: 'prma_seex',
                          code: 'seex_qm_032_edi_02'
                        },
                        {
                          ident: 'prma_buco',
                          code: 'buco_qm_032_edi_02'
                        }
                ]" @click="handleManage(1, record)">编辑</a>
                    </template>
                    <template v-if="record.whetherRestructure == '1'">
                      <a v-btnPermission="[
                        {
                          ident: 'prma_seex',
                          code: 'seex_qm_032_rec_06'
                        },
                        {
                          ident: 'prma_buco',
                          code: 'buco_qm_032_rec_06'
                        }
                ]" @click="handleManage(3, record)">重构</a>
                    </template>
                    <template v-if="record.whetherEdit == '1' && record.isRestructure != '1'">
                      <a v-btnPermission="[
                        {
                          ident: 'prma_seex',
                          code: 'seex_qm_032_sta_05'
                        },
                        {
                          ident: 'prma_buco',
                          code: 'buco_qm_032_sta_05'
                        }
                ]" v-if="record.status == 0" @click="handleRemove(record)"
                        >启用</a
                      >
                      <a v-btnPermission="[
                        {
                          ident: 'prma_seex',
                          code: 'seex_qm_032_sto_04'
                        },
                        {
                          ident: 'prma_buco',
                          code: 'buco_qm_032_sto_04'
                        }
                ]" v-else class="del_btn" @click="handleRemove(record)">停用</a>
                    </template>
                  </template>
                </MoreButton>
              </span>
              <!-- 检查项数量 -->
              <template slot="checkItemNumber" slot-scope="text, record">
                {{ text }}
                <span v-if="record.isRestructure == '1'" class="del_btn">（重构）</span>
              </template>
              <a-list
                slot="expandedRowRender"
                slot-scope="record"
                item-layout="horizontal"
                :data-source="record.checkItems"
              >
                <a-list-item slot="renderItem" slot-scope="item">
                  <a-row style="width: 80%">
                    <a-col :span="6">检查项名称：{{ item.checkItemName }}</a-col>
                    <a-col :span="6">判定类型：{{ item.judgmentType }}</a-col>
                    <a-col :span="6">判定值：{{ item.value }}</a-col>
                    <a-col :span="6"
                      >单位：{{ item.unit }}<span class="del_btn" v-if="item.isRestructure == '1'">（重构）</span></a-col
                    >
                  </a-row>
                </a-list-item>
              </a-list>
            </list-table>
            </div>
          </a-col>
        </a-row>
  </base-breadcrumb>
</template>

<script>
import { STable } from '@/components' // 表格
import { pointList } from '@/api/quality/reality' // list api
import TreeSubItem from '@/components/businessComponents/TreeSubItem' // 树
import TabsProductType from '@/components/businessComponents/TabsProductType' // 工程类别tabs
import SelectSubCompany from '@/components/Select/SelectSubCompany' // 分公司
import SelectProject from '@/components/Select/SelectProject' // 项目名称
import Selector from '@/components/Select/Selector'
import BaseEditPage from '@/views/baseEditPage'
import TabsOrgLevels from '@/components/businessComponents/TabsOrgLevels' // tabs

const columns = [
  {
    title: '编号',
    dataIndex: 'code',
     width: 220,
    ellipsis: true
  },
  {
    title: '点位名称',
    dataIndex: 'pointName',
    width: 220,
    ellipsis: true
  },
  {
    title: '点位等级',
    dataIndex: 'belong',
    width: 220,
    ellipsis: true
  },
  {
    title: '检查项数量',
    dataIndex: 'checkItemNumber',
    width: 220,
    scopedSlots: { customRender: 'checkItemNumber' }
  },
  {
    title: '点位描述',
    dataIndex: 'pointDescription',
    width: 220,
    ellipsis: true
  },
  {
    title: '操作',
    dataIndex: 'action',
    width: 220,
    scopedSlots: { customRender: 'action' }
  }
]
export default {
  name: 'a' + Date.now(),
  extends: new BaseEditPage(),
  components: {
    STable,
    TreeSubItem,
    TabsProductType,
    TabsOrgLevels
  },
  computed: {
    searchArr() {
      return [
        // 搜索框
        // {
        //   type: Selector,
        //   valueKey: 'pointLevelId',
        //   name: '点位等级',
        //   selectType: '15'
        // },
        {
          name: '点位名称',
          value: 'pointName',
          type: 'input'
        },
        {
          name: '检查项名称',
          value: 'checkItemName',
          type: 'input'
        },
        {
          name: '编号',
          value: 'code',
          type: 'input'
        },
        {
          name: '状态',
          value: 'status',
          type: 'select',
          data: [
            {
              value: '0',
              label: '停用'
            },
            {
              value: '1',
              label: '启用'
            }
          ]
        }
      ]
    },
    // 是否有子节点
    hasChildren() {
      return (
        !this.selectOptions.parentId || this.selectedKeys.length < 1 || this.selectOptions.dataRef?.children?.length > 0
      )
    },
    // 节点标题
    nodeTitle() {
      let title = this.selectOptions.name || '请选择分部分项工程'
      return title
    },
    // 表格列表请求参数
    args() {
      let args = this.queryParam
      // 添加工程类别id
      args.projectTypeId = this.projectTypeId
      // 添加分部分项id
      this.selectedKeys.length > 0 && (args.subItemId = this.selectedKeys[0])
      // if (this.selectOptions.id) {
      //   args.subItemId = this.selectOptions.id
      // }
      this.checkItemLevelId && (args.pointLevelId = this.checkItemLevelId)
      return args
    }
  },
  data() {
    this.columns = columns
    return {
      checkItemLevelId: '', // 检查项等级
      checkItemOption: {}, // 选中检查项等级
      // 操作类型：0 添加 1 编辑 3 查看
      projectTypeId: '', // 工程类别选项控件
      // 责任区域弹窗控件
      visible: false,
      selectedKeys: [], // 选中节点
      // 弹窗参数
      form: null,
      queryParam: {}, // 查询参数
      // 加载数据方法 必须为 Promise 对象
      loadData: (parameter) => {
        let that = this
        if (that.selectedKeys?.length && !that.$refs.table.localLoading) {
          const requestParameters = Object.assign({}, parameter, that.args)
          return pointList.postList(requestParameters).then((res) => {
            return res
          })
        }
      },
      selectOptions: {}, // 选中节点对象
      editModel: '',
      scrollerHeight:null
    }
  },
  mounted(){
  },
  methods: {
    /**
     * 切换检查项等级
     */
    handleSwitch() {
      this.$nextTick(() => {
        this.$refs.table.refresh(true)
      })
    },
    // 获取分项工程
    getSubItem() {
      let that = this
      that.$refs.treeSearch.getList().then((res) => {
        // 获取列表
        that.search()
      })
    },
    // 头部搜索
    search(value) {
      // 赋值表单
      if (value) {
        this.queryParam = value
      }
      this.$refs.table.refresh(true)
    },
    // 提交问题分类表单
    submitForm(e) {
      let that = this
      let name = ['create', 'update'][that.editModel] // 根据操作切换url地址
      if (that.editModel == 0) {
        e.subItemId = e.id
      }
      // e.subItemName = e.name
      pointList[name](e)
        .then((res) => {
          that.$refs.dialogProblem.loading = false
          // if (res.code == 200) {
          that.$message.success(['添加', '编辑'][that.editModel] + '成功！')
          that.visible = false
          that.$refs.table.loadData()
          // } else {
          //   that.$message.warning(['添加', '编辑'][that.editModel] + '失败！')
          // }
        })
        .catch((res) => {
          that.$refs.dialogProblem.loading = false
        })
    },
    // 移除区域
    handleRemove(e) {
      let that = this
      let status = ['启用', '停用'][e.status] || '操作'
      that.$confirm({
        title: '温馨提示',
        content: `确认${status}？`,
        okText: '提交',
        cancelText: '关闭',
        onOk() {
          return pointList.switchStatus({ id: e.id, status: e.status ? 1 : 0 }).then((res) => {
            // if(res.code == 200){
            that.$message.success(status + '成功！')
            that.$refs.table.loadData()
            // }
          })
        }
      })
    },
    // 点位：新增/编辑/查看
    handleManage(b, a) {
      // b 操作类型;a 行数据
      let query = {
        editModel: b,
        subItemId: this.selectOptions.id
      }
      if (a) {
        query.id = a.id
      }
      this.$router.push({
        name: '/quality/measuredAmount/pointListMaintenance/pointListMaintenanceEdit',
        query
      })
    }
  }
}
</script>
